<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // 场景
    // 函数调用传入数组，每隔一秒依次输出成员

    /// 使用map方法循环
    // function print(arr) {
    //   let pro = Promise.resolve()
    //   arr.map(v => {
    //     // 每次遍历都会给pro重新赋值,会等待上一次定时器完成，修改状态后，再赋值的
    //     pro = pro.then(() => {
    //       // 返回promise对象
    //       return new Promise(resolve => {
    //         // 定时器1s
    //         setTimeout(() => {
    //           // 输出本项成员
    //           console.log(v);
    //           // 改变状态
    //           resolve()
    //         }, 1000)
    //       })
    //     })
    //   })
    // }


    /// 使用reduce方法循环
    function print(arr) {
      arr.reduce((pro, v) => {
        // 每次遍历都会给pro重新赋值,会等待上一次定时器完成，修改状态后，再赋值的
        return pro.then(() => {
          // 返回promise对象
          return new Promise(resolve => {
            // 定时器1s
            setTimeout(() => {
              // 输出本项成员
              console.log(v);
              // 改变状态
              resolve()
            }, 1000)
          })
        })
      },Promise.resolve())
    }

    print([1, 2, 3, 4, 5, 6])




  </script>
</body>

</html>